<template>
  <div class="" v-loading="loading">
    <el-button
      type="primary"
      size="mini"
      @click="onEdit(2)"
      style="margin-bottom: 10px"
      >新增执行标准</el-button
    >
    <el-table :data="tableData" style="width: 100%" border>
      <el-table-column label="执行标准(中文)" align="center" prop="title_des">
      </el-table-column>
      <el-table-column label="执行标准" align="center" prop="title">
      </el-table-column>

      <el-table-column label="操作" align="center">
        <template slot-scope="{ row }">
          <el-button type="text" size="default" @click="onEdit(row)"
            >编辑</el-button
          >
          <el-button
            type="text"
            style="color: red"
            size="default"
            @click="onDelete(row.id)"
            >删除</el-button
          >
        </template>
      </el-table-column>
    </el-table>
    <!-- <pagination
      :form="form"
      :total="total"
      @paginationPostOrderTaskList="postAdminCodeGetTagcategory"
    /> -->
    <el-dialog
      :title="form.id ? '编辑执行标准' : '新建执行标准'"
      :visible.sync="dialogFormVisible"
      :close-on-click-modal="false"
      width="600px"
      @close="closeDialog"
    >
      <el-form
        :model="formobj"
        :rules="rules"
        ref="formobj"
        label-position="left"
        label-width="120px"
      >
        <el-form-item label="执行标准(中文)" prop="title">
          <el-input
            style="width: 300px"
            v-model="formobj.title_des"
            placeholder="请输入执行标准(中文)"
          ></el-input>
        </el-form-item>
        <el-form-item label="执行标准" prop="title">
          <el-input
            style="width: 300px"
            v-model="formobj.title"
            placeholder="请输入执行标准"
          ></el-input>
        </el-form-item>
        <el-form-item>
          <el-button
            :disabled="!formobj.title_des || !formobj.title"
            type="primary"
            size="default"
            @click="onCreation"
            :loading="loading"
            >{{ formobj.id ? "修改" : "新建" }}</el-button
          >
        </el-form-item>
      </el-form>
    </el-dialog>
  </div>
</template>
    
    <script>
import {
  postAdminCodeGetTagcategory,
  postApidelcategory,
  postApieditcategory,
} from "@/api";
import pagination from "@/components/pagination.vue";
export default {
  components: { pagination },
  data() {
    return {
      loading: false,
      dialogVisible: false,
      dialogFormVisible: false,
      dataDP: "",
      formobj: {
        fid: 0,
        types: 3,
        title: "",
        title_des: "",
      },
      form: {
        types: 3,
        page: 1,
        size: 10000,
      },
      tableData: [],
      total: 1,
    };
  },
  mounted() {
    let form = this.form;
    this.postAdminCodeGetTagcategory(form);
  },
  methods: {
    // 编辑
    onEdit(e) {
      if (e == 2) {
        this.formobj.title = "";
        this.formobj.title_des = "";
        this.dialogFormVisible = true;
      } else {
        this.formobj.title = e.title;
        this.formobj.title_des = e.title_des;
        this.formobj.id = e.id;
        this.dialogFormVisible = true;
      }
    },
    // 创建
    onCreation() {
      let that = this;
      this.loading = true;
      this.$refs["formobj"].validate((valid) => {
        if (valid) {
          this.loading = false;
          postApieditcategory(this.formobj)
            .then((res) => {
              console.log("编辑品类", res);
              if (this.formobj.id) {
                this.$message.success("编辑执行标准成功");
              } else {
                this.$message.success("新建执行标准成功");
              }
              this.postAdminCodeGetTagcategory(that.form);
              this.loading = false;
              this.dialogFormVisible = false;
              this.formobj = { fid: 0, types: 3, title: "", title_des:"" };
            })
            .catch((err) => {
              console.log("err", err);
              this.$message.warning(err.msg);
              this.loading = false;
            });
        } else {
          this.loading = false;
          return false;
        }
      });
    },
    // 新增
    onAdd() {
      this.$router.push({ name: "MaintenanceDetail" });
    },
    // 删除
    onDelete(id) {
      this.$confirm("此操作将永久删除该执行标准, 是否继续?", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
      })
        .then(() => {
          postApidelcategory(id)
            .then((res) => {
              this.$message.success("删除成功");
              this.postAdminCodeGetTagcategory(this.form);
            })
            .catch((err) => {
              this.$message.warning(err.msg);
            });
        })
        .catch(() => {});
    },
    // 采购列表
    async postAdminCodeGetTagcategory(data) {
      this.loading = true;
      this.form = data;
      postAdminCodeGetTagcategory(data)
        .then((res) => {
          this.loading = false;
          console.log("采购列表", res);
          this.tableData = res.data;
          this.total = Number(res.total);
        })
        .catch((err) => {
          this.loading = false;
        });
    },
    // 搜索
    onSearch() {
      this.form.page = 1;
      this.form.size = 10;
      this.postAdminCodeGetTagcategory(this.form);
    },
  },
};
</script>
    
    <style lang="scss" scoped>
.myform {
  display: flex;
  justify-content: space-between;
  > div {
    display: flex;
  }
  &-item {
    margin-right: 10px;
  }
}
</style>
    